<template>
	<view class="login-content">
		<view class="login">
			<p>欢迎使用，智慧订餐服务</p>
			<p>授权微信头像、昵称</p>
			<p>
				<image class='img' src="@/static/cart/login.png"/>
			</p>
			<p>为您提供优质服务,大地智慧需要获取您的以下信息：</p>
			<p>· 您的公开信息(头像、昵称等)</p>
			<button @click='getUserInfo'>授权进入智慧订餐服务</button>
			<p>
				<span>登录代表您已同意</span>
				<span>《用户服务协议》《隐私权政策》</span>
			</p>
		</view>
	</view>
</template>

<script>
	export default{
		methods:{
			getUserInfo(){
				let that = this;
				uni.getUserProfile({
					desc:'weixin',
					success(res){
						uni.switchTab({
							url: '/pages/tab1/tab1'
						})
						that.$store.state.a.infoName = res.userInfo.nickName
						that.$store.state.a.infoImg = res.userInfo.avatarUrl
						that.$store.state.a.infoGender = res.userInfo.gender
						const accountInfo = uni.getAccountInfoSync();
						that.$store.state.a.appId = accountInfo.miniProgram.appId
					},
					fail(err){
						uni.showToast({
							title:'授权失败'
						})
					}
				})
			}
		}
	}
</script>

<style lang='scss'>
	.login-content{
		width: 100%;
		height: 100vh;
		background-image: linear-gradient(to right bottom,#FFFFFF,#F0F8FF);
    .login{
			box-sizing: border-box;
			padding-top: 220rpx;
			width: 95%;
			margin-left: 2.5%;
			height: 100%;
			p:{
				position: relative;
			}
			p:first-of-type{
				font-size: 50rpx;
			}
			p:nth-of-type(2){
				margin-top: 20rpx;
				font-size: 33rpx;
				color: #999999
			}
			p:nth-of-type(3){
				width: 100%;
				margin-top: 40rpx;
				display: flex;
				justify-content: center;
				.img{
					width: 400rpx;
					height: 400rpx;
				}
			}
			p:nth-of-type(4){
				margin-top: 40rpx;
				font-size: 30rpx;
			}
			p:nth-of-type(5){
				margin-top: 20rpx;
				font-size: 28rpx;
				color: #999999
			}
			p:last-of-type{
				width: 100%;
				position: fixed;
				left: 0;
				bottom: 70rpx;
				text-align: center;
				font-size: 26rpx;
				span:last-child{
					color: #00BFFF;
				}
			}
			button{
				width: 100%;
				height: 100rpx;
				line-height: 100rpx;
				position: relative;
			  top: 80rpx;
				border-radius: 50rpx;
				background-image: linear-gradient(to right,#00BFFF,#1E90FF);
				color: white;
				font-size: 35rpx;
				font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
			}
		}
	}
</style>
